.wea-doc-center {
  .center {
    position: relative;
    height: 100%;
    font-family: "PingFangSC-Regular";
    color: #333333;
    letter-spacing: -0.08px;

    .centerright-text-bolder {
      font-weight: 700;
      padding-left: 44px;
    }

    .usericon {
      border-radius: 50%;
      border: 1px solid #FFFFFF;
    }

    .left-number {
      font-family: "PingFang-SC-Medium";
      color: #FF8F00;
      font-weight: 600;
    }

    .left-number-float {
      .left-number;
      float: right;

      &:after {
        content: "";
        clear: both;
      }
    }

    .centerleft-user {
      text-align: center;
      padding: 24px 0;

      div {
        font-family: "PingFangSC-Regular";
        color: #333333;
        letter-spacing: -0.08px;
      }

      .centerleft-user-img {
        .usericon;
        width: 54px;
        height: 54px;
      }

      .wea-popover-hrm-wrapper .wea-popover-hrm-userimg {
        position: relative;
      }

      a {
        color: #333333;
      }

      a:hover {
        text-decoration: none;
        color: #00a9ff;
      }
    }

    .centerleft-ul {
      font-family: "PingFangSC-Regular";
      color: #333333;
      letter-spacing: -0.08px;

      li {
        border-bottom: 1px solid #e2e2e2;
        //padding: 10px 0px 10px 5px;
        padding: 10px 20px;
        cursor: pointer;

        &:hover {
          background: #ebf9ff;
        }
      }

      span {
        display: inline-block;
      }

      span:nth-child(2) {
        .left-number-float;
      }

      .centerleft-span {
        position: relative;
      }

      .centerleft-sup {
        position: absolute;
        margin-top: 13px;
        margin-left: -3px;
      }
    }

    .centerleft-ranking {
      padding-top: 24px;
      font-family: "PingFangSC-Regular";
      color: #333333;
      letter-spacing: -0.08px;

      .centerleft-icon-container {
        padding: 0 20px 12px 20px;

        span {
          color: #2DB7F5;
          padding-right: 8px;
          font-weight: bold;
        }
      }

      .centerleft-ranking-content {
        padding: 5px 28px 5px 30px;
        cursor: pointer;

        &:hover {
          background: #ebf9ff;
        }

        span:nth-child(1) {
          padding-right: 16px;
        }

        span:nth-child(2) {
          .left-number;
        }

        span:nth-child(3) {
          float: right;

          &:after {
            content: "";
            clear: both;
          }
        }

        .icon-document-Ranking {
          color: #2DB7F5;
          font-size: 12px;
        }
      }
    }

    .centerleft-btn {
      font-family: "PingFangSC-Regular";
      letter-spacing: -0.08px;
      margin: 14px 20px 24px 20px;
      background: #2DB7F5;
      border-radius: 2px;
      color: #ffffff;

      .centerleft-btn-upload {
        width: 100%;
        height: 34px;
        cursor: pointer;
      }

      span:nth-child(1) {
        padding-right: 10px;
      }
    }

    .centerleft-reader {
      font-family: "PingFangSC-Regular";
      color: #333333;
      letter-spacing: -0.08px;
      padding: 0 20px;

      a {
        color: #333333;
      }

      a:hover {
        text-decoration: none;
        color: #00a9ff;
      }

      .ant-col-6 {
        text-align: center;
      }

      .centerleft-icon-container {
        padding-bottom: 12px;

        span {
          color: #2DB7F5;
          padding-right: 8px;
          font-weight: bold;
          cursor: pointer;
        }
      }

      .centerleft-reader-img {
        width: 38px;
        height: 38px;
        .usericon;
      }
    }

    .centerleft-more {
      font-family: "PingFangSC-Regular";
      color: #333333;
      letter-spacing: -0.08px;
      border-top: 1px solid #E8E8E8;
      padding: 10px;
      text-align: right;

      .centerleft-more-btn {
        height: 30px;
        width: 70px;
      }
    }

    .center-left {
      position: absolute;
      width: 260px;
      height: 100%;
      background: #FFFFFF;
      box-shadow: 1px 1px 0 0 #E2E2E2;
      //padding: 0 20px;
    }

    .center-right {
      width: 100%;
      height: 100%;
      padding-left: 260px;
      overflow-x: hidden;
      background: #f4f4f4;
      padding-bottom: 9px;
    }

    .centerright-main {
      padding: 11px 11px 0 11px;
      font-family: "PingFangSC-Regular";
      color: #333333;
      letter-spacing: -0.08px;

      .centerright-main-top {
        position: relative;
        height: 40px;
        background: #f9f9f9;
        border-top: 1px solid #e2e2e2;
        border-left: 1px solid #e2e2e2;
        border-right: 1px solid #e2e2e2;

        span:nth-child(1) {
          color: #F14A2D;
          font-size: 22px;
          position: absolute;
          padding: 10px 10px 10px 12px;
        }

        span:nth-child(2) {
          line-height: 40px;
          display: inline-block;
          padding-right: 5px;
        }

        span:nth-child(3) {
          float: right;
          font-size: 16px;
          padding-top: 10px;
          padding-right: 15px;
          color: #B2B2B2;
          transform: rotate(-30deg);
          -ms-transform: rotate(-30deg);
          /* IE 9 */
          -moz-transform: rotate(-30deg);
          /* Firefox */
          -webkit-transform: rotate(-30deg);
          /* Safari and Chrome */
          -o-transform: rotate(-30deg);

          /* Opera */
          &:after {
            content: "";
            clear: both;
          }
        }

        .icon-document-Partner {
          color: #007BFF !important;
        }

        .icon-coms-Refresh {
          cursor: pointer;
        }
      }

      .centerright-main-content {
        background: #ffffff;
        border-bottom: 1px solid #e2e2e2;
        border-left: 1px solid #e2e2e2;
        border-right: 1px solid #e2e2e2;

        .centerright-loading {
          text-align: center;
          line-height: 375px;
        }

        .centerright-contentempty {
          font-family: "PingFangSC-Regular";
          letter-spacing: -0.08px;
          background: #FFFFFF;
          text-align: center;
          color: #666666;
          padding: 20px 0;
          height: 335px;
          padding: 120px 0;

          .centerright-icon-blank {
            font-size: 80px;
            color: #EEEEEE;
          }
        }

        .centerright-specialuser {
          padding: 8px 12px 0 0;
          float: right;

          &:after {
            content: "";
            clear: both;
          }

          .wea-associative-search {
            width: 150px;
            // height: 30px;
          }
        }

        .ant-tabs-ink-bar {
          width: 60px !important;
          margin-left: 15px !important;
        }

        .centerright-main-more {
          position: relative;
          line-height: 40px;
          text-align: center;
          color: #999999;

          a {
            text-decoration: none;
            color: #999999;
          }

          a:link {
            text-decoration: none;
          }

          a:visited {
            text-decoration: none;
          }

          a:hover {
            text-decoration: none;
            color: #00a9ff;
          }

          a:active {
            text-decoration: none;
          }

          span {
            cursor: pointer;
          }

          span:nth-child(2) {
            font-size: 9px;
            padding-left: 2px;
          }

          .rotate-right {
            position: absolute;
            display: inline-block;
            font-size: 18px !important;
            transform: rotate(90deg) scale(0.5);
            -ms-transform: rotate(90deg) scale(0.5);
            /* IE 9 */
            -webkit-transform: rotate(90deg) scale(0.5);
            /* Safari and Chrome */
            -moz-transform: rotate(90deg) scale(0.5);
            /* Firefox */
            -o-transform: rotate(90deg) scale(0.5);
            /* Opera */
            margin-top: 11px;
            cursor: pointer;
          }

          .rotate-down {
            transform: scale(0.5);
            -ms-transform: scale(0.5);
            /* IE 9 */
            -webkit-transform: scale(0.5);
            /* Safari and Chrome */
            -moz-transform: scale(0.5);
            /* Firefox */
            -o-transform: scale(0.5);
            /* Opera */
          }
        }

        .centerright-main-list {
          border-bottom: 1px dashed #E2E2E2;
        }

        .centerright-main-list,
        .centerright-main-list-end {
          height: 67px;
          position: relative;
          margin: 0 15px;
          padding: 18px 0 20px 0;

          .icon-document-html,
          .icon-document-word,
          .icon-document-excel,
          .icon-document-pdf,
          .icon-document-currency {
            font-size: 30px !important;
            position: absolute;
            border: 1px solid #FFFFFF;
            border-radius: 3px;
          }

          .icon-document-html {
            color: #FFBB32;
          }

          .icon-document-word {
            color: #0176FA;
          }

          .icon-document-excel {
            color: #64D16F;
          }

          .icon-document-pdf {
            color: #DF4430;
          }

          img {
            position: absolute;
            display: inline-block;
            border-radius: 50%;
            border: 1px solid #ffffff;
            width: 36px;
            height: 36px;
          }

          .centerright-article {
            cursor: pointer;
          }

          .centerright-article:hover {
            color: #00a9ff !important;
          }

          .centerright-main-ul {
            padding: 0 0 0 46px;
            margin-top: -7px;
            display: inline-block;
            width: 100%;
            ul {
              line-height: 12px;
              display: inline-block;
              color: #999999;
            }

            span {
              display: inline-block;
              padding-top: 6px;
              padding-right: 12px;
            }

            .centerright-main-hover {
              display: inline-block;
              padding-top: 6px;
              padding-right: 12px;
              color: #999999;
            }

            .centerright-main-hover:hover {
              color: #00a9ff;
            }

            .centerright-main-hoverl {
              display: inline-block;
              padding-top: 6px;
              padding-right: 12px;
              color: #333333;
            }

            .centerright-main-hoverl:hover {
              color: #00a9ff;
            }

            .centerright-doctext {
              font-family: "PingFangSC-Regular";
              color: #333333;
              letter-spacing: -0.08px;
              width: 100%;
              white-space: nowrap;
              overflow: hidden;
              text-overflow: ellipsis;
            }

            .centerright-span-text {
              color: #999999;
            }

            .centerright-li-text {
              color: #333333;
            }
          }

          .centerright-main-div {
            float: right;
            line-height: 12px;
            color: #B2B2B2;

            &:after {
              content: '';
              clear: both;
            }

            span:nth-child(odd) {
              padding-left: 7px;
              padding-right: 4px;
            }

            span:nth-child(even) {
              display: inline-block;
              width: 30px;
            }

            div {
              display: inline-block;
            }
          }
        }
      }
    }
  }
}

.wea-doc-center-reply-more {
  text-align: right;
  line-height: 60px;
  border-top: 1px solid #c4c4c4;

  .icon-coms-up {
    display: inline-block;
    font-size: 12px;
    transform: rotate(90deg) scale(0.8);
    -ms-transform: rotate(90deg) scale(0.8);
    /* IE 9 */
    -webkit-transform: rotate(90deg) scale(0.8);
    /* Safari and Chrome */
    -moz-transform: rotate(90deg) scale(0.8);
    /* Firefox */
    -o-transform: rotate(90deg) scale(0.8);
    /* Opera */
    cursor: pointer;
    color: #B2B2B2;
  }

  .reply-btn {
    position: absolute;
    bottom: 45px;
    right: 16px;
    width: 140px;
    border: 1px solid #d9d9d9;

    .ant-menu-item {
      text-align: left;
      padding: 0 !important;
    }

    .menu-content {
      display: inline;

      .menu-icon {
        display: inline-block;
        background: #f3f6f9;

        .icon-coms-Collection,
        .icon-coms-help {
          padding: 15px 6px;
        }
      }

      .menu-text {
        display: inline-block;
        padding-left: 6px;
        padding-right: 83px;
      }
    }

    .menu-content:hover {
      display: inline;

      .menu-icon {

        .icon-coms-Collection,
        .icon-coms-help {
          background: #30b7f4;
          color: #ffffff;
        }
      }

      .menu-text {
        background: #30b7f4;
        color: #ffffff;
      }
    }
  }

  .reply-more {
    cursor: pointer;
    font-family: "PingFangSC-Regular";
    color: #333333;
    letter-spacing: -0.08px;
    border: 1px solid #d9d9d9;
    display: inline;
    border-radius: 3px;
    padding: 6px 14px;
    margin-right: 16px;
  }
}

.wea-doc-center-centerleft-reply {
  .centerleft-reply-loading {
    color: #0099ff;
    text-align: center;
    padding: 10px 0;
  }

  .centerleft-reply-end {
    position: relative;
    margin: 0 15px;
    padding: 18px 0;

    .centerleft-reply-img {
      width: 40px;
      height: 40px;
      border: 1px solid #ffffff;
      -webkit-border-radius: 50%;
      -moz-border-radius: 50%;
      border-radius: 50%;
      position: absolute;
      display: inline-block;
    }

    .centerleft-reply-ul {
      display: inline-block;
      padding-left: 54px;

      .reply-hrm {
        color: #333333;
      }

      .reply-hrm:hover {
        cursor: pointer;
        color: #00a9ff;
      }

      .centerleft-reply-a {
        color: #333333;
      }

      .center-reply-docname {
        color: #0066ff;
        cursor: pointer;
      }

      .center-reply-docname:hover {
        color: #4d7ad8;
      }

      .centerleft-reply-li {
        padding-top: 6px;

        .icon-coms-Good {
          font-family: 'icon-blog';
          font-weight: 400;
          font-style: normal;
          font-size: 12px;
          color: #0099ff;
          padding-right: 5px;
        }
      }

      .centerleft-reply-span {
        padding-left: 12px;
      }

      .centerleft-reply-color {
        color: #999999;
      }
    }
  }

  .centerleft-reply {
    border-bottom: 1px dashed #e2e2e2;
    position: relative;
    margin: 0 15px;
    padding: 18px 0;

    .centerleft-reply-img {
      width: 40px;
      height: 40px;
      border: 1px solid #ffffff;
      -webkit-border-radius: 50%;
      -moz-border-radius: 50%;
      border-radius: 50%;
      position: absolute;
      display: inline-block;
    }

    .centerleft-reply-ul {
      display: inline-block;
      padding-left: 54px;

      .reply-hrm {
        color: #333333;
      }

      .reply-hrm:hover {
        cursor: pointer;
        color: #00a9ff;
      }

      .centerleft-reply-a {
        color: #333333;
      }

      .center-reply-docname {
        color: #0066ff;
        cursor: pointer;
      }

      .center-reply-docname:hover {
        color: #4d7ad8;
      }

      .centerleft-reply-li {
        padding-top: 6px;

        .icon-coms-Good {
          font-family: 'icon-blog';
          font-weight: 400;
          font-style: normal;
          font-size: 12px;
          color: #0099ff;
          padding-right: 5px;
        }
      }

      .centerleft-reply-color {
        color: #999999;
      }
    }
  }
}

.wea-doc-center-left-upload {
  .ant-modal-footer {
    text-align: left;
  }

  .wea-dialog-body {
    padding: 20px 30px;

    .wea-doc-center-uploadfile {

      // 选择文档浏览器按钮
      .wea-associative-search {
        padding-right: 30px;
        width: 100% !important;
        margin: 0 !important;

        .ant-select-selection {
          min-height: 37px !important;
        }

        .ant-select-selection--multiple {
          .ant-select-selection__rendered {
            padding-top: 6px;
          }
        }

        .ant-select {
          margin-top: 0 !important;
          margin-left: 0 !important;
        }

        .ant-input-group-wrap {
          width: 30px;

          i {
            font-size: 16px;
            margin-top: 13px;
          }
        }

        .anticon-loading {
          top: 12px;
          right: 32px;
        }
      }

      // 提示
      .centerleft-upload-tip {
        padding: 10px 0 16px;
        color: #ff5114;
      }

      .centerleft-upload-tipl {
        padding: 10px 0 16px;
        color: #ff5114;

        .centerleft-upload-noupload {
          color: #f39;
        }
      }
    }

    .wea-doc-center-centerleft-dialog {
      position: relative;
      border: 1px solid #e4e4e4;
      text-align: center;
      font-family: "PingFangSC-Regular";
      color: #333333;
      height: 344px;

      .wea-doc-center-left-upload {
        width: 100%;

        .btns-style {
          height: 38px;
          line-height: 28px;
        }

        .wea-upload {
          width: 158px;
          padding-top: 0;
          display: inline-block;

          .wea-upload-container>span {
            width: 100%;
          }
        }

        &-uploading-btn {
          width: 100%;
          .btns-style;

          &>i {
            margin-right: 10px
          }
        }

        &-uploading-btn-cancel {
          width: 50%;
          .btns-style;
        }
      }

      .wea-doc-center-left-upload-uploading {
        position: absolute;
        bottom: 0;
        background-color: #fff;

        .btns-style-1 {
          height: 36px;
          line-height: 26px;
          border-width: 1px;
          border-radius: 0;
          margin-bottom:2px; 
          border-color: #5ec7f700;
        }

        .wea-upload {
          width: 50%;
        }

        .wea-doc-center-left-upload-uploading-btn {
          background-color: #fff;
          .btns-style-1;
          &:hover {
            .btns-style-1;
            color: #57c5f7;
          }
        }

        .wea-doc-center-left-upload-uploading-btn-cancel {
          .btns-style-1;
          border-width: 0;
          &:hover {
            border-width: 0;
          }
        }
      }
    }
  }
}